
<ion-view view-title="第{{currentDate}}期详情">
  <ion-slide-box active-slide="index" on-slide-changed="slideHasChanged()">
    <ion-slide ng-repeat="array in lists">

      <!--逾期-->
      <div ng-if="arr[$index].repaymentDetailsOverdueView">
        <div class="state-content row">
          <div class="col-20 state-icon">
            <img src="../img/overdue.png" alt="" />
          </div>
          <div class="col-80 state-information">
            <h3 class="state-title">逾期</h3>

            <p class="state-date">还款截止日<span>{{array.periodEndTime}}</span></p>
          </div>
        </div>
        <div class="specifics-list repayment-term-list">
          <div class="row month-repayment">
            <div class="col-33">当月应还</div>
            <div class="text-right col-66">{{array.planPayAmt}}元</div>
          </div>
          <div class="information-details">
            <div class="row">
              <div class="col-33">本金</div>
              <div class="text-right col-66">{{array.planPayPrincipal | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">利息</div>
              <div class="text-right col-66">{{array.planPayInterest | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">平台费</div>
              <div class="text-right col-66">{{array.planPayManage | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">罚息</div>
              <div class="text-right col-66">{{array.planPayPenalty | currency:"": 2}}元</div>
            </div>
            <div class="row month-repayment repayment-line">
              <div class="col-33">实际已还</div>
              <div class="text-right col-66">{{array.actualPayAmt | currency:"": 2}}元</div>
            </div>
          </div>
        </div>

        <div class="padding">
          <div class="padding">
            <button class="button button-block button-positive request-button" ng-click="repaymentRepay(array)"
                    ng-disabled="!arr[$index].canPay">去还款
            </button>
          </div>
        </div>
      </div>
      <!--已还清-->
      <div ng-if="arr[$index].repaymentDetailsPayView">
        <div class="state-content row">
          <div class="col-20 state-icon">
            <img src="../img/also-has.png" alt="" />
          </div>
          <div class="col-80 state-information">
            <h3 class="state-title">已还款</h3>

            <p class="state-date">还款截止日<span>{{array.periodEndTime}}</span></p>
          </div>
        </div>
        <div class="specifics-list repayment-term-list">
          <div class="row month-repayment">
            <div class="col-33">当月应还</div>
            <div class="text-right col-66">{{array.planPayAmt}}元</div>
          </div>
          <div class="information-details">
            <div class="row">
              <div class="col-33">本金</div>
              <div class="text-right col-66">{{array.planPayPrincipal | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">利息</div>
              <div class="text-right col-66">{{array.planPayInterest | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">平台费</div>
              <div class="text-right col-66">{{array.planPayManage | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">罚息</div>
              <div class="text-right col-66">{{array.planPayPenalty | currency:"": 2}}元</div>
            </div>
          </div>
          <div class="row month-repayment repayment-line">
            <div class="col-33">实际已还</div>
            <div class="text-right col-66">{{array.actualPayAmt | currency:"": 2}}元</div>
          </div>
        </div>
      </div>
      <!--未还款-->
      <div ng-if="arr[$index].repaymentDetailsView">
        <div class="state-content row">
          <div class="col-20 state-icon">
            <img src="../img/not-yet.png" alt="" />
          </div>
          <div class="col-80 state-information">
            <h3 class="state-title">未还款</h3>

            <p class="state-date">还款截止日<span>{{array.periodEndTime}}</span></p>
          </div>
        </div>
        <div class="specifics-list repayment-term-list">
          <div class="row month-repayment">
            <div class="col-33">当月应还</div>
            <div class="text-right col-66">{{array.planPayAmt}}元</div>
          </div>
          <div class="information-details">
            <div class="row">
              <div class="col-33">本金</div>
              <div class="text-right col-66">{{array.planPayPrincipal | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">利息</div>
              <div class="text-right col-66">{{array.planPayInterest | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">平台费</div>
              <div class="text-right col-66">{{array.planPayManage | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">罚息</div>
              <div class="text-right col-66">{{array.planPayPenalty | currency:"": 2}}元</div>
            </div>
          </div>
          <div class="row month-repayment repayment-line">
            <div class="col-33">实际已还</div>
            <div class="text-right col-66">{{array.actualPayAmt | currency:"": 2}}元</div>
          </div>
        </div>
        <div class="padding">
          <div class="padding">
            <button class="button button-block button-positive request-button" ng-click="repaymentRepay(array)"
                    ng-disabled="!arr[$index].canPay">去还款
            </button>
          </div>
        </div>
      </div>
      <!--未还清-->
      <div ng-if="arr[$index].repaymentDetailsNotPayView">
        <div class="state-content row">
          <div class="col-20 state-icon">
            <img src="../img/not-yet.png" alt="" />
          </div>
          <div class="col-80 state-information">
            <h3 class="state-title">未还清</h3>

            <p class="state-date">还款截止日<span>{{array.periodEndTime}}</span></p>
          </div>
        </div>
        <div class="specifics-list repayment-term-list">
          <div class="row month-repayment">
            <div class="col-33">当月应还</div>
            <div class="text-right col-66">{{array.planPayAmt}}元</div>
          </div>
          <div class="information-details">
            <div class="row">
              <div class="col-33">本金</div>
              <div class="text-right col-66">{{array.planPayPrincipal | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">利息</div>
              <div class="text-right col-66">{{array.planPayInterest | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">平台费</div>
              <div class="text-right col-66">{{array.planPayManage | currency:"": 2}}元</div>
            </div>
            <div class="row">
              <div class="col-33">罚息</div>
              <div class="text-right col-66">{{array.planPayPenalty | currency:"": 2}}元</div>
            </div>
          </div>
          <div class="row month-repayment repayment-line">
            <div class="col-33">实际已还</div>
            <div class="text-right col-66">{{array.actualPayAmt | currency:"": 2}}元</div>
          </div>
        </div>
        <div class="padding" canPay>
          <div class="padding">
            <button class="button button-block button-positive request-button" ng-click="repaymentRepay(array)"
                    ng-disabled="!arr[$index].canPay">去还款
            </button>
          </div>
        </div>
      </div>
    </ion-slide>
  </ion-slide-box>
</ion-view>

